<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="renderer" content="webkit">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<title></title>
    <meta name="keywords" content="">
    <link rel="stylesheet" href="../plugin/styles/iview.css" />
    <link rel="stylesheet" href="../css/displaySet.css">
    <link rel="stylesheet" href="../css/common.css">
    <style>
      /* #index{
        width: 100%;
        background: url(../img/background.png) no-repeat;
        height: 100%;
      } */
      .nav-header{
        width: 100%;
        height: 50px;
        background: url(../img/background.png) no-repeat;
        background-size: cover; 
        z-index: 999;
        position: absolute;
      }
      .aside-menu{
        background: url(../img/background.png) no-repeat;
        background-size: cover; 
        width: 15%;
        min-width: 190px;
        height: 100%;
        position: absolute;
        /* margin-top: -50px */
      }
      #iframeContent{
        width: 85%;
        height: 100%;
        margin-left: 15%;
        /* background-size: cover;  */
        position: absolute;
        /* margin-top: 50px */
      }
      html, body {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="index" class="container">
      <!-- 导航栏 -->
      <div class="nav-header">
        <header >
          <nav>
            <div class="header-background">
              <div class="header-left">
                <img src="../img/title-logo.png" class="logo">
              </div>  
              <div class="header-right" style="cursor: pointer">
                <span class="title-icon" @click="goBigScreenPage">
                  <img src="../img/title-in.png" class="image-right">
                  <span>进入大屏</span>
                </span>
                <span class="title-icon" style="cursor: pointer">
                  <img src="../img/title-user.png" class="image-right">
                  <span>账户设置</span>
                </span>
                <span class="title-icon" style="cursor: pointer" onclick="window.location=GET_logout">
                  <img src="../img/title-out.png" class="image-right">
                  <span>退出登录</span>
                </span>
                <span class="title-icon" style="cursor: pointer" @click="goBigScreenPage">
                  <img src="../img/title-back.png" class="image-right">
                  <span>返回</span>
                </span> 
              </div>
            </div>
          </nav>
        </header>
      </div>
      <!-- 导航栏结束 -->
      <div style="height: 100%;">
      <!-- 侧边栏开始 -->
      <div class="aside-menu">
        <!-- 左边菜单栏开始 -->
        <div class="aside-content">
          <ul class="aside-bg" >
            <li @click="goDisplaySet()">
              <img src="../img/aside-displaySetOn.png" style="margin-top: 50px" class="click-menu click-menu-hover" id="display-menu-image">
            </li>
            <li @click="goAccountRoleManage()">
              <img src="../img/aside-accountManageOff.png" class="click-menu display-set-on" id="account-menu-image">   
            </li>
            <li>
              <img style="visibility: hidden" src="../img/aside-screenEditOff.png" class="click-menu display-set-on">
            </li>
            <li>
              <img style="visibility: hidden" src="../img/aside-messageSetOff.png" class="click-menu display-set-on">
            </li>
          </ul>
        </div>
        <!-- 侧边栏结束 -->
      </div>
      <!-- 侧边栏结束 -->
      <iframe id="iframeContent" :src="page" name="iframeContent" frameborder="0"></iframe>    
      </div>
    </div>
    <script src="../js/vue.min.js"></script>
	  <script src="../plugin/iview.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/bootstrap.min.js?v=3.3.6"></script>
    <script src="../js/displaySet/page.js"></script>
    <script src="../js/axios.min.js"></script>
    <script src="../../../js/mock.js"></script>
    <script src="../../../js/api.js"></script>
    
    <script>
      new Vue({
        el: '#index',
        data() {  
          return{
            page:'displaySet.html'
          } 
        },
        methods:{
          // 跳转账号管理页面
          goAccountRoleManage(){
            var adminObj=JSON.parse(sessionStorage.loginData); 
            var goAccount = document.getElementById("account-menu-image"); 
            var goDisplay= document.getElementById("display-menu-image");
              if (goAccount.getAttribute("src") == "../img/aside-accountManageOff.png") {
                goAccount.setAttribute("src", "../img/aside-accountManageOn.png"); 
                goDisplay.setAttribute("src", "../img/aside-displaySetOff.png");    
              }
              // this.page='roleManage.html'
              if(adminObj.是否超级管理员!==0){
                this.page='roleManage.html'
              }else{
                this.page='manageAccount.html'
              }
          },
          //跳转显示设置页面
          goDisplaySet(){
            var goAccount = document.getElementById("account-menu-image"); 
            var goDisplay= document.getElementById("display-menu-image");
              if (goDisplay.getAttribute("src") == "../img/aside-displaySetOff.png") {
                goDisplay.setAttribute("src", "../img/aside-displaySetOn.png"); 
                goAccount.setAttribute("src", "../img/aside-accountManageOff.png");    
              }
            this.page='displaySet.html'
          },
          // 跳转进入大屏
          goBigScreenPage(){
            window.location = '../../../index.html'
            // window.open('../../../index.html','_self')
          }
        }
      })
    </script>
  </body>
</html>